<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}
			
			body,
			html {
				width: 100%;
				margin: auto;
			}
			
			#wrap {
				width: 910px;
				height: 725px;
				/*border: 1px solid black;*/
				margin: 0 auto;
			}
			
			#head {
				width: 910px;
				height: 100px;
				margin-top: 35px;
			}
			
			#language {
				width: 734px;
				margin-left: 190px;
			}
			
			#language>p {
				display: inline-block;
				margin-left: 360px;
			}
			
			#xuanze {
				width: 215px;
				height: 25px;
			}
			
			#language>span {
				font-size: 10px;
			}
			
			#language>p>a {
				color: #006600;
				text-decoration: none;
				font-size: 10px;
				font-weight: 700;
			}
			
			#nav {
				width: 920px;
				height: 100px;
				background: url(../img/img/head_bg.jpg)no-repeat;
				background-position-x: 180px;
				margin-top: -25px;
				position: relative;
				/*border: 1px solid black;*/
			}
			
			.nav>li {
				width: 146px;
				height: 100px;
				/*border: 1px solid black;*/
				background: url(../img/img/menu_part.gif)no-repeat;
				background-position-y: 34px;
				background-position-x: 144px;
				display: inline-block;
				list-style: none;
				float: left;
				text-align: center;
				line-height: 100px;
				margin-top: -26px;
				margin-left: 1px;
			}
			
			.nav {
				width: 920px;
				height: 100px;
				/*border: 1px solid black;*/
				margin-top: 0px;
				line-height: 100px;
			}
			
			.nav>li>a {
				text-decoration: none;
				color: white;
				font-size: 15px;
			}
			
			.nav>li>a:hover {
				color: yellow;
			}
			
			#middle {
				width: 910px;
				/*height: 750px;*/
				/*border: 1px solid black;*/
				margin-top: 10px;
				position: relative;
				overflow: hidden;
			}
			
			#footer {
				width: 910px;
				height: 225px;
				margin-top: 10px;
			}
			
			#footer div {
				width: 890px;
				height: 95px;
				margin-left: 15px;
				position: relative;
			}
			
			#footer p {
				text-align: center;
			}
			
			#footer>p>a {
				color: #0F5A27;
				font-size: 10px;
				text-decoration: none;
			}
			
			#footer:nth-child(3) {
				color: #0F5A27;
				font-size: 10px;
				margin-top: 20px;
			}
			
			#slider {
				width: 200px;
				height: 351px;
				/*border: 1px solid black;*/
				z-index: 100;
				position: absolute;
				top: 70px;
				left: 325px;
				display: none;
			}
			
			#slider>li {
				width: 220px;
				height: 35px;
				background: #008000;
				list-style: none;
				border: 1px solid #E1ECE3;
			}
			
			#slider>li>a {
				text-decoration: none;
				color: white;
				font-weight: 200;
				margin-left: 10px;
				line-height: 35px;
			}
			
			#slider>li>a:hover {
				color: yellow;
			}
			
			#erweima {
				position: absolute;
				left: 640px;
				top: -240px;
				display: none;
			}
			
			.production {
				width: 596px;
				height: 447px;
				float: left;
			}
			
			.production>img {
				width: 596px;
				height: 447px;
			}
			
			#menu_right {
				width: 291px;
				float: right;
			}
			
			#menu_right>ul>li {
				color: #0CA251;
				list-style: none;
				border-bottom: 1px solid gainsboro;
				cursor: pointer;
			}
			
			#menu_right>ul>li>a {
				text-decoration: none;
				color: #75B733;
				font-weight: 900;
				line-height: 40px;
			}
			
			.right_menu_food>li>a {
				color: black;
				text-decoration: none;
				font-size: 5px;
			}
			
			.right_menu_food>li>a:hover {
				color: #75B733;
				text-decoration: underline;
			}
			
			.right_menu_food>li {
				list-style: none;
			}
			
			#menu_right>ul>li>b {
				float: right;
				margin-right: 30px;
				color: gainsboro;
				font-weight: 900;
				line-height: 40px;
			}
			
			.right_menu_food {
				display: none;
			}
			
			.right_menu_food>li>span {
				font-size: 3px;
			}
		</style>
	</head>

	<body>
		<div id="wrap">
			<!--头部-->
			<div id="head">

				<!--导航蓝-->
				<div id="nav">
					<div id="language">
						<span>中国</span>
						<p>
							<select id="xuanze" onchange="setLanguage(this)">
								<option value="">select lanugage</option>
								<option value="chn">chinese</option>
								<option value="eng">english</option>
							</select>
							<a href="http://www.subway.com/nogeo">|&nbsp;进入全球官网</a>
						</p>
					</div>
					<ul id="slider">
						<li>
							<a href="">超值 value</a>
						</li>
						<li>
							<a href="">经典 Classics</a>
						</li>
						<li>
							<a href="">精选 Premlum</a>
						</li>
						<li>
							<a href="">低脂 Low Fat</a>
						</li>
						<li>
							<a href="">百味卷 Wrap</a>
						</li>
						<li>
							<a href="">沙拉 Salad</a>
						</li>
						<li>
							<a href="">聚餐服务 Cartring</a>
						</li>
						<li>
							<a href="">饮料和小食 Drings和Slide</a>
						</li>
						<li>
							<a href="">早餐 BREAKFIRST</a>
						</li>
						<li>
							<a href="">营养 Nutrltion</a>
						</li>
						<li>
							<a href="">如何点餐 How To Order</a>
						</li>
					</ul>
					<ul class="nav">
						<li style="width: 180px;">
							<a href="1首页.html"><img src="../img/img/logo.jpg" /></a>
						</li>
						<li>
							<a href="新闻动态.html">新闻动态</a>
						</li>
						<li id="lan">
							<a href="美食.html">美食与营养</a>
						</li>
						<li>
							<a href="加盟流程.html">加盟流程</a>
						</li>
						<li>
							<a href="关于我们.html">关于我们</a>
						</li>
						<li style="background: url(../img/img/menu-bg-last.gif)no-repeat; background-position-y: 34px;margin-left: -1px;">
							<a href="">快餐店位置查询</a>
						</li>
					</ul>
				</div>
			</div>
			<div id="middle">
				<div class="production"><img src="../img/img/food.jpg" /></div>
				<div id="menu_right">
					<ul>
						<li class="right_menu1">
							<a href="###">超值Value</a>
							<b></b>
							<ul class="right_menu_food right_menu_food1">
								<li><span>►</span>
									<a href="###">意大利香辣 Spicy Italian</a>
								</li>
								<li><span>►</span>
									<a href="###">培根 B.L.T</a>
								</li>
								<li><span>►</span>
									<a href="###">火腿 Ham</a>
								</li>
								<li><span>►</span>
									<a href="###">新鲜蔬菜 Veggie Delite</a>
								</li>
							</ul>
						</li>
						<li class="right_menu2">
							<a href="###">经典 Classics</a>
							<b></b>
							<ul class="right_menu_food right_menu_food2">
								<li><span>►</span>
									<a href="###">意大利经典 Italian B.M.T.™</a>
								</li>
								<li><span>►</span>
									<a href="###">意大利香肠 Italian Sausage</a>
								</li>
								<li><span>►</span>
									<a href="###">香烤鸡排 Roasted Chicken</a>
								</li>
								<li><span>►</span>
									<a href="###">火鸡胸 Turkey Breast</a>
								</li>
								<li><span>►</span>
									<a href="###">日式照烧鸡 Chicken Teriyaki</a>
								</li>
							</ul>
						</li>
						<li class="right_menu3">
							<a href="###">精选 Premium</a>
							<b></b>
							<ul class="right_menu_food right_menu_food3">
								<li><span>►</span>
									<a href="###">金枪鱼 Tuna</a>
								</li>
								<li><span>►</span>
									<a href="###">香热奇士 Subway Melt</a>
								</li>
								<li><span>►</span>
									<a href="###">香烤牛肉 Roast Beef</a>
								</li>
								<li><span>►</span>
									<a href="###">奇士牛排 Steak & Cheese</a>
								</li>
								<li><span>►</span>
									<a href="###">百味俱乐部 Subway Club™</a>
								</li>
							</ul>
						</li>
						<li class="right_menu4">
							<a href="###">低脂 Low Fat</a>
							<b></b>
							<ul class="right_menu_food right_menu_food4">
								<li><span>►</span>
									<a href="###">火腿 Ham</a>
								</li>
								<li><span>►</span>
									<a href="###">火鸡胸 Turkey Breast</a>
								</li>
								<li><span>►</span>
									<a href="###">香烤鸡排 Roasted Chicken</a>
								</li>
								<li><span>►</span>
									<a href="###">香烤牛肉 Roast Beef</a>
								</li>
								<li><span>►</span>
									<a href="###">百味俱乐部 Subway Club™</a>
								</li>
							</ul>
						</li>
						<li class="right_menu_food_taste">
							<a href="###">百味卷 Wrap</a>
						</li>
						<li class="right_menu_food_taste1">
							<a href="###">沙拉 Salad</a>
						</li>
						<li class="right_menu5">
							<a href="###">聚餐服务 Catering</a>
							<b></b>
							<ul class="right_menu_food right_menu_food5">
								<li><span>►</span>
									<a href="###">三明治拼盘 Sandwich Platter</a>
								</li>
								<li><span>►</span>
									<a href="###">甜饼拼盘 Cookie Platter</a>
								</li>
								<li><span>►</span>
									<a href="###">巨型三明治 Giant Sub</a>
								</li>
							</ul>
						</li>
						<li class="right_menu_food_taste2">
							<a href="###">饮料和小食 Drinks & Sides</a>
						</li>
						<li class="right_menu_food_taste3">
							<a href="###">早餐 BREAKFAST</a>
						</li>
						<li class="right_menu6">
							<a href="###">营养 Nutrition</a>
							<b></b>
							<ul class="right_menu_food right_menu_food6">
								<li><span>►</span>
									<a href="###">营养问与答 FAQ</a>
								</li>
							</ul>
						</li>
						<li class="right_menu_food_taste4">
							<a href="###">如何点餐 How To Order</a>
						</li>
					</ul>
				</div>
			</div>
			<div id="footer">
				<div id="footer_pic">
					<a href="建议位置.html"><img src="../img/img/home-box-1_CN.jpg" /></a>
					<a href="美食.html"><img src="../img/img/home-box-2_CN.jpg" /></a>
					<a href="新闻动态.html"><img src="../img/img/home-box-3_CN.jpg" /></a>
					<a href="http://weibo.com/subwayrestaurantcn?is_hot=1"><img src="../img/img/weibo_CN.jpg" /></a>
					<a href="" style="position: relative;"><img src="../img/img/weixin_CN.jpg" /></a>
					<span id="erweima"><img src="../img/2099963A-E268-466F-AD98-ABEDB455165E.png"/></span>
				</div>
				<p id="footer_a">
					<a href="">主页|</a>
					<a href="">菜单/营养|</a>
					<a href="">如何加盟|</a>
					<a href="">关于我们|</a>
					<a href="">快餐店位置查询</a><br />
					<a href="">联系我们|</a>
					<a href="">使用条款|</a>
					<a href="">隐私权政策|</a>
					<a href="">SUBWAY Partners™</a>
				</p>
				<p>SUBWAY® is a Registered Trademark of Subway IP Inc. <br /> ®2016 Subway IP Inc.</p>
			</div>
		</div>
		<script type="text/javascript">
			//导航栏滑动		
			$("#lan").hover(function() {
					$("#slider").css({
						display: "block"
					})
					$("#slider").mouseleave(function() {
						$("#slider").css({
							display: "none"
						})
					})
				})
				//页脚 图片 二维码
			$("#footer_pic>a>img").eq(0).hover(function() {
				$(this).attr("src", "../img/home-box-1_CN_hover.jpg")
			}).mouseleave(function() {
				$(this).attr("src", "../img/img/home-box-1_CN.jpg")
			})
			$("#footer_pic>a>img").eq(1).hover(function() {
				$(this).attr("src", "../img/home-box-2_CN_hover.jpg")
			}).mouseleave(function() {
				$(this).attr("src", "../img/img/home-box-2_CN.jpg")
			})
			$("#footer_pic>a>img").eq(3).hover(function() {
				$(this).attr("src", "../img/home-box-3_CN_hover.jpg")
			}).mouseleave(function() {
				$(this).attr("src", "../img/img/home-box-3_CN.jpg")
			})
			$("#footer_pic>a>img").eq(3).hover(function() {
				$(this).attr("src", "../img/weibo_CN_hover.jpg")
			}).mouseleave(function() {
				$(this).attr("src", "../img/img/weibo_CN.jpg")
			})
			$("#footer_pic>a>img").eq(5).hover(function() {
					$(this).attr("src", "../img/weixin_CN_hover.jpg")
					$("#erweima").css({
						display: "block"
					})
				}).mouseleave(function() {
					$(this).attr("src", "../img/img/weixin_CN.jpg")
					$("#erweima").css({
						display: "none"
					})
				})
				//小箭头
			$("#menu_right>ul>li>b").html(">");
			//下拉菜单栏效果
			$("#menu_right>ul>li>a").eq(0).click(function() {
				if($(".right_menu_food").eq(0).css("display") == "none") {
					$(".right_menu_food").eq(0).slideDown({
						height: 120
					}, 2000)
					$("#menu_right>ul>li>b").eq(0).html("v").css({
						color: "green"
					});
				} else {
					$(".right_menu_food").eq(0).slideUp({
						height: 0
					}, 2000)

					$("#menu_right>ul>li>b").eq(0).html(">").css({
						color: "gainsboro"
					});
				}
			})
			$("#menu_right>ul>li>a").eq(1).click(function() {
				if($(".right_menu_food").eq(1).css("display") == "none") {
					$(".right_menu_food").eq(1).slideDown({
						height: 120
					}, 2000)
					$("#menu_right>ul>li>b").eq(1).html("v").css({
						color: "green"
					});
				} else {
					$(".right_menu_food").eq(1).slideUp({
						height: 0
					}, 2000)
					$("#menu_right>ul>li>b").eq(1).html(">").css({
						color: "gainsboro"
					});
				}
			})
			$("#menu_right>ul>li>a").eq(2).click(function() {
				if($(".right_menu_food").eq(2).css("display") == "none") {
					$(".right_menu_food").eq(2).slideDown({
						height: 120
					}, 2000)
					$("#menu_right>ul>li>b").eq(2).html("v").css({
						color: "green"
					});
				} else {
					$(".right_menu_food").eq(2).slideUp({
						height: 0
					}, 2000)
					$("#menu_right>ul>li>b").eq(2).html(">").css({
						color: "gainsboro"
					});
				}
			})
			$("#menu_right>ul>li>a").eq(3).click(function() {
				if($(".right_menu_food").eq(3).css("display") == "none") {
					$(".right_menu_food").eq(3).slideDown({
						height: 120
					}, 2000)
					$("#menu_right>ul>li>b").eq(3).html("v").css({
						color: "green"
					});
				} else {
					$(".right_menu_food").eq(3).slideUp({
						height: 0
					}, 2000)
					$("#menu_right>ul>li>b").eq(3).html(">").css({
						color: "gainsboro"
					});
				}
			})
			$("#menu_right>ul>li>a").eq(6).click(function() {
				if($(".right_menu_food").eq(4).css("display") == "none") {
					$(".right_menu_food").eq(4).slideDown({
						height: 120
					}, 2000)
					$("#menu_right>ul>li>b").eq(4).html("v").css({
						color: "green"
					});
				} else {
					$(".right_menu_food").eq(4).slideUp({
						height: 0
					}, 2000)
					$("#menu_right>ul>li>b").eq(4).html(">").css({
						color: "gainsboro"
					});
				}
			})
			$("#menu_right>ul>li>a").eq(9).click(function() {
				if($(".right_menu_food").eq(5).css("display") == "none") {
					$(".right_menu_food").eq(5).slideDown({
						height: 120
					}, 2000)
					$("#menu_right>ul>li>b").eq(5).html("v").css({
						color: "green"
					});
				} else {
					$(".right_menu_food").eq(5).slideUp({
						height: 0
					}, 2000)
					$("#menu_right>ul>li>b").eq(5).html(">").css({
						color: "gainsboro"
					});
				}
			})

			//导航栏 点击变图片
			$(".right_menu_food1>li>a").eq(0).click(function() {
				$(".production>img").attr("src", "../img/img/aaa1.png")
			})
			$(".right_menu_food1>li>a").eq(1).click(function() {
				$(".production>img").attr("src", "../img/img/aaa2.png")
			})
			$(".right_menu_food1>li>a").eq(1).click(function() {
				$(".production>img").attr("src", "../img/img/aaa2.png")
			})
			$(".right_menu_food_taste").click(function() {
				$(".production>img").attr("src", "../img/img/屏幕快照 2017-04-11 下午8.52.04.png")
			})
			$(".right_menu_food_taste1").click(function() {
				$(".production>img").attr("src", "../img/img/屏幕快照 2017-04-11 下午8.52.15.png")
			})
			$(".right_menu_food_taste2").click(function() {
				$(".production>img").attr("src", "../img/img/屏幕快照 2017-04-11 下午8.52.27.png")
			})
			$(".right_menu_food_taste3").click(function() {
				$(".production>img").attr("src", "../img/img/屏幕快照 2017-04-11 下午8.52.53.png")
			})
			$(".right_menu_food_taste4").click(function() {
				$(".production>img").attr("src", "../img/img/屏幕快照 2017-04-11 下午8.52.40.png")
			})
		</script>
	</body>

</html>